<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title></title>
    <link rel="stylesheet" href="/css/element.css" />
</head><link rel="stylesheet" href="/css/element.css">

<script src="/js/Vue.js"></script>
<script src="/js/element.js"></script>
<script src="/js/axios.js"></script>
<script src="/js/formDataUtils.js"></script>
<script src="/js/jquery.min.js"></script>
<script type="text/javascript" src="/js/layer.js"></script>
<style>
    #tools .el-card__body {
        padding: 5px 5px 5px 20px;
    }
    .el-link {
        margin-right:8px;
    }
    #tools .el-button {
        padding: 10px 8px 10px 5px;
    }
    #template {
        height:100%;
    }
    /* #search .el-card__body {
        height:40px;
    } */
    #table {
        height:calc(100% - 120px);
    }
    /*翻页样式*/
    .el-pagination {
        margin-top:5px;
    }
    #tools .el-button {
        padding: 10px 8px 10px 5px;
        background-color:whitesmoke !important;
        color: black !important;
        border: none !important;
      }
      .el-form-item label{
        text-align: left !important;
        width: 86px !important;
        vertical-align: middle;
        float: left;
        font-size: 14px;
        color: #606266;
        line-height: 40px;
        padding: 0 12px 0 0;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
      }
</style>
<div id="template">
    <!--增加系列框-->
    <el-card class="box-card" id="search" >
        <el-form :inline="false" class="demo-form-inline">
          <el-form-item label="用户名:">
            <el-autocomplete clearable class="inline-input" style="width:200px;" v-model="addusername" 
            placeholder="请输入用户名" :fetch-suggestions="querySearch" :trigger-on-focus="false"
            @change="setParam1" @select="handleSelect"> 
            </el-autocomplete>
        </el-form-item>
          <el-form-item label="姓名:">
            <el-input clearable placeholder="请输入姓名" style="width:200px;" v-model="addnickname"
             @change="setParam2" :disabled="bname"></el-input>
        </el-form-item>
          <el-form-item label="所在部门: ">
            <el-input clearable style="width:200px;":value="choosedeptname" :disabled="false"></el-input>
            <el-button size="small" @click="chooseDept" :disabled="btndisabled">选择
            </el-button>
        </el-form-item>
        <el-form-item>
           <template>
               <el-checkbox id="checkbox1" v-model="isAdmin" @change="handleCheckAdminChange">设为部门管理员</el-checkbox>
           </template>
        </el-form-item>
        <el-form-item>
            <template>
            <el-checkbox  id="checkbox2"  v-model="isCanMeeting" @change="handleCheckMeetingChange">设置允许创建评审</el-checkbox>
            </template>
        </el-form-item>
        <el-form-item>
            <template>
            <el-checkbox id="checkbox3"  v-model="isCanReview" @change="handleCheckReviewChange">设置允许创建评审会议</el-checkbox>
            </template>
        </el-form-item>
        </el-form>
</div>
<script>
    Vue.config.productionTip = false;//屏蔽提示信息
    //当前编辑的场景数据
    //var sceneData = {};
    //场景id
    var sceneId;
    var sceneData = parent.sceneData;
    var datetree = parent.datetree;
    var choosewindow = null;
    var vue = new Vue({
        el: "#template",
        data() {
            return {
                bname:false,
                restaurants:[],
                addusername:'',
                addnickname:'',
                btndisabled:false,
                deptid:sceneData.deptid,
                choosedeptname:'',
                choosedeptid:'',
                isAdmin:['false'],
                isCanReview:['false'],
                isCanMeeting:['false'],
            }
        },
        
        mounted(){
            this.getAllUsername();
        },
        
        methods:{
            setParam1(){
                // parent.vue.editname = this.name;
                //   parent.vue.senior = this.senior;
                //   parent.vue.subSenior = this.subSenior;
                //   parent.vue.intermediate = this.intermediate;
                //   parent.vue.junior = this.junior;
                //   parent.vue.staff = this.staff;
                //console.log('text1 changed');
                this.bname = false;
                this.addnickname = '';
                parent.vue.addusername = this.addusername;
            },

            setParam2(){
                // parent.vue.editname = this.name;
                //   parent.vue.senior = this.senior;
                //   parent.vue.subSenior = this.subSenior;
                //   parent.vue.intermediate = this.intermediate;
                //   parent.vue.junior = this.junior;
                //   parent.vue.staff = this.staff;
                parent.vue.addnickname = this.addnickname;
            },

            querySearch(queryString, cb) {
            var restaurants = this.restaurants;
            var results = queryString ? restaurants.filter(this.createFilter(queryString)) : restaurants;
        // 调用 callback 返回建议列表的数据
           cb(results);
         },

          createFilter(queryString) {
            return (restaurant) => {
              return (restaurant.value.toLowerCase().indexOf(queryString.toLowerCase()) === 0);
            };
          },
          getAllUsername() {   
            let that = this;
            let params = {
              username:'',
              //keyword: this.searchForm.keyword,
              page:1,
              size:10,
            };
            axios
              .get("/syatem/query_User", { params })
              .then((res) => {
              let  data1 = res.data.data.content;
                //console.log(res.data);
                //console.log(res.data.data.content);
                let resdata=[];
               // console.log(data1);
                for(var i=0;i<data1.length;i++){
                  var obj={};
                  var str1 = 'value';
                  var str2 = 'address';
                  obj[str1] = data1[i].username;
                  obj[str2] = data1[i].nickname;
                  resdata.push(obj);
                    //resdata[i].value = data1[i].username;
                  }
                  //console.log(resdata);
                  this.restaurants=resdata;
                console.log('一共有:'+resdata.length+'条数据');
              })
              .catch((err) => {
                console.log(err);
              });
            //let datearr=[];
            //console.log('选中了:'+arr1);
            //console.log('用户类型:'+that.unit);
          },
  
          handleSelect(item)
            {
              console.log(item);
              this.addnickname = item.address;
              this.bname = true;
              //this.busername=true;  
            },

            handleCheckAdminChange(val) {
                this.isAdmin[0] = val;
                parent.vue.addisAdmin[0] = val;
             },
            
             handleCheckMeetingChange(val) {
                this.isCanReview[0] = val;
                parent.vue.addisCanReview[0] = val;
             },

             handleCheckReviewChange(val) {
                this.isCanMeeting[0] = val;
                parent.vue.addisCanMeeting[0] = val;
             },
          //弹出选择部门窗口
          chooseDept() {
              console.log('.......');
              if(choosewindow){return}
          //场景id赋值
          //打开弹窗
          let that = this;
          that.btndisabled=true;
          choosewindow=layer.open({
              type: 2,
              title: '选择部门',
              shadeClose: false,
              shade: false,
              closeBtn: false,
              maxmin: true, //开启最大化最小化按钮
              area: ['400px', '300px'],
              content: '/dialog/department/choosedept.html',
            //   btn:['选择'],
            //   yes:()=>
            //   {
            //       layer.close(choosewindow);
            //       console.log('选择部门:'+that.choosedeptid);
            //   },
              cancel: function () {
                //that.choosedeptid='';
                //that.choosedeptname='';
                  console.log('cancel...')
               },
              end: () => {
                      //console.log('end...')
                      //parent.vue.choosedeptid = that.choosedeptid;
                      //parent.vue.choosedeptname = that.choosedeptname;
                  //this.searchAllScene();
                  //sceneData = {};
                        }
                });
            },
        
        },
        //因为end方法不会执行所以在这里就监听并且赋值
        watch:{
　              choosedeptid(newVal,oldVal){
                    parent.vue.addeptid = newVal;
                    //console.log('some guys changed id');
            },
                choosedeptname(newVal,oldVal){
                    parent.vue.addeptname = newVal;
                    //console.log('some guys changed name');
            }
            },

        filters:{
          deptdesc:function(deptid){
            // if(deptid)
            // {
            //   this.deptdesc=deptid;
            // }
            // else 
            // {
            //   this.deptdesc='无所属';
            // }
			    },
		}

    })
</script>

</html>
